import axios from 'axios'
import { Message } from 'element-ui'
import store from '@/store/index'
import router from '@/router'
// 创建axios实例，如果有多个接口创建多个
const service = axios.create({
  // 1.开发环境不一样，请求地址不同
  //  1.1域名不同，服务器不一样
  //  1.2域名一样，后缀不一样，服务器是同一台
  //  1.3process.env.VUE_APP_BASE_API根据环境动态改变地址
  //  1.4不用加域名，locahost：4399->直接反向代理
  baseURL: process.env.VUE_APP_BASE_API,
  timeout: 5000
})
// 请求拦截器
service.interceptors.request.use(config => {
  if (store.getters.token) config.headers.Authorization = 'Bearer ' + store.getters.token
  return config
}, (error) => {
  return Promise.reject(error) // 抛出异常
})

// 响应拦截器
service.interceptors.response.use(function(response) {
  // 请求成功2xx
  const { success, data, message } = response.data // 1.数据解构
  if (success) {
    return data // 成功返回数据
  } else {
    Message.error(message) // 2.业务错误=>密码错误，少了请求数据（后端定义的错误，接口已经返回，一般用状态码）
    return Promise.reject(new Error(message)) // 没有error对象 自己new一个 传入message参数
  }
}, function(error) {
  // 请求失败4xx  网络超时、代理错误
  //  ?. 可选链  层数比较多用短路运算符太麻烦 可选链前面得不到后面的值会返回underfined  （error.response如果是null）
  console.log(error.response)
  if (error?.response?.data?.code === 10002) {
    router.push('/login')
    store.dispatch('user/logout')
  }
  Message.error(error.response.data.message)
  return Promise.reject(error) // 抛出异常
})

export default service
